<template>
  <div>
    <div>
      <el-breadcrumb
        separator-class="el-icon-arrow-right"
        style="marginbottom: 10px"
      >
        <el-breadcrumb-item
          ><i class="el-icon-location-outline" />
          &nbsp;&nbsp;&nbsp;当前位置</el-breadcrumb-item
        >
        <el-breadcrumb-item @click.native="changePage" style="cursor: pointer"
          >入职/新增</el-breadcrumb-item
        >
        <el-breadcrumb-item>批量上传员工</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <div class="batchupstaff">
      <ul class="batchupstaff-process">
        <li class="process-n process-n1">1</li>
        <li class="paocess-l1"></li>
        <li class="process-n">2</li>
        <li class="paocess-l2"></li>
        <li class="process-n">3</li>
      </ul>
      <ul class="batchupstaff-mian">
        <div class="batchupstaff-mian-title">设置花名册表头字段</div>
        <li class="tx1">
          请根据你的Excel花名册表头，匹配【员工档案字段】中相似表头字段
        </li>
        <li>若无相似表头字段，请新增字段</li>
        <div class="batchupstaff-mian-border brd">去设置表头字段</div>
        <div class="batchupstaff-mian-text">若已设置，可跳过这一步</div>
        <div class="batchupstaff-mian-x">下载模板，填写内容</div>
        <div class="batchupstaff-mian-border">下载模版</div>
        <div class="batchupstaff-mian-s">上传填写的内容</div>
        <div>
          <el-upload
            class="upload-demo"
            drag
            action="https://jsonplaceholder.typicode.com/posts/"
            multiple
            width="250px"
          >
            <i class="el-icon-upload"></i>
            <div class="el-upload__text">
              拖拽文件到这里上传
              <div>点击上传</div>
            </div>
          </el-upload>
        </div>
      </ul>
      <div class="flooter-b">确定</div>
    </div>
  </div>
</template>
 
<script>
export default {
  props: ["changeAddStaff"],
  methods: {
    //面包屑返回上级页面
    changePage() {
      this.changeAddStaff(false);
    },
  },
};
</script>

<style>
</style>